<template>
    <div class="flex justify-end">
        <el-button type="primary" @click="strat_fun" >开始录音</el-button>
        <el-button type="primary" @click="stop_fun">停止录音</el-button>
    </div>
    <div class="basis-11 mt-4">
        <el-table :data="tableData" border >
        
        <el-table-column prop="channel_id"    label="通道"      align="center" fixed/>
        <el-table-column prop="line_number"   label="线路号码"  align="center"/>
        <el-table-column prop="mode"          label="模式"      align="center"/>
        <el-table-column prop="status"        label="状态"      align="center"/>
        <el-table-column prop="direction"     label="方向"      align="center"/>
        <el-table-column prop="calling"       label="主叫号码"  align="center" min-width="120"/>
        <el-table-column prop="called"        label="被叫号码"  align="center" min-width="120"/>
        <el-table-column prop="time_start"    label="开始时间"  align="center" min-width="120"/>
        <el-table-column prop="talk_time"     label="通话时长"  align="center"/>

        <el-table-column prop="monitoring"    label="监听"      align="center">
            <template v-slot:default="scope">
                <el-switch v-model="scope.row.monitoring"/>
            </template>
        </el-table-column>

        <el-table-column prop="voltage" label="电压" align="center"/>
        </el-table>
    </div>
  </template>
  
  <script setup>
  import { ref ,onMounted,getCurrentInstance} from 'vue'
  import { Microphone, Mute } from '@element-plus/icons-vue'

  const handleClick = () => {
    console.log('click')
  }
  
  const tableData = [
    {
        channel_id: 1,
        line_number: '123',
        mode: 'California',
        status: 'Los Angeles',
        direction: 'A2B',
        calling: '15263781288',
        called: '27912378129',
        time_start:'5:10',
        talk_time:'20',
        monitoring:true,
        voltage:3.3,
    },
    {
        channel_id: 2,
        line_number: '123',
        mode: 'California',
        status: 'Los Angeles',
        direction: 'A2B',
        calling: '15263781288',
        called: '27912378129',
        time_start:'5:10',
        talk_time:'20',
        monitoring:true,
        voltage:3.3,
    },
    {
        channel_id: 3,
        line_number: '123',
        mode: 'California',
        status: 'Los Angeles',
        direction: 'A2B',
        calling: '15263781288',
        called: '27912378129',
        time_start:'5:10',
        talk_time:'20',
        monitoring:true,
        voltage:3.3,
    },
    {
        channel_id: 4,
        line_number: '123',
        mode: 'California',
        status: 'Los Angeles',
        direction: 'A2B',
        calling: '15263781288',
        called: '27912378129',
        time_start:'5:10',
        talk_time:'20',
        monitoring:true,
        voltage:3.3,
    },
    {
        channel_id: 5,
        line_number: '123',
        mode: 'California',
        status: 'Los Angeles',
        direction: 'A2B',
        calling: '15263781288',
        called: '27912378129',
        time_start:'5:10',
        talk_time:'20',
        monitoring:true,
        voltage:3.3,
    },
    {
        channel_id: 6,
        line_number: '123',
        mode: 'California',
        status: 'Los Angeles',
        direction: 'A2B',
        calling: '15263781288',
        called: '27912378129',
        time_start:'5:10',
        talk_time:'20',
        monitoring:true,
        voltage:3.3,
    },
    {
        channel_id: 7,
        line_number: '123',
        mode: 'California',
        status: 'Los Angeles',
        direction: 'A2B',
        calling: '15263781288',
        called: '27912378129',
        time_start:'5:10',
        talk_time:'20',
        monitoring:true,
        voltage:3.3,
    },
    {
        channel_id: 8,
        line_number: '123',
        mode: 'California',
        status: 'Los Angeles',
        direction: 'A2B',
        calling: '15263781288',
        called: '27912378129',
        time_start:'5:10',
        talk_time:'20',
        monitoring:true,
        voltage:3.3,
    },
  ]

    //page init
    onMounted(()=> {
      console.log("通道状态->请求：",tableData);
      proxy.$http.get('/api/baidu/?city=wuhan',{})
        .then((rv) => {
              console.log(rv);
          })
    })

    const { proxy } = getCurrentInstance()
    function strat_fun(){
        console.log("通道状态->开始录音");
        proxy.$http.post('/jd2/gw/generic/hj/h5/m/latestPrice',{})
        .then((rv) => {
              console.log(rv);
          })
    }

    function stop_fun(){
        console.log("通道状态->停止录音");
        proxy.$http.post('/api/baidu/?city=wuhan',{id:'1'})
        .then((rv) => {
              console.log(rv);
          })
    }
</script>

<style>

</style>